Restricting Features in Frontend

Decoding JWTs using Javascript and Preventing Render in Ionic

ND004 C03 L04 A05 Decoding JWTs 1

Validating in Frontend

SOLUTION:

API/Backend - Fulfilling of Requests

Reasons for Frontend Permissions

SOLUTION:

Improved user experience by limiting interactions to only those which can be fulfiled
Reduced number of requests which cannot be fulfilled by server

Decoding JWTs in Javascript

ND004 C03 L04 A06 Decoding JWTs In Javascript 1

Try it yourself!

Answer the question below using the following JWT and Javascript function.

TIP use the developer tools console to execute the javascript

eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VybmFtZSI6Imp1aWNlcHJvIiwicGVybWlzc2lvbnMiOlsicG9zdDpqdWljZSJdfQ.7m6ukD61G--xjWGIJJNBRwVJkSrnKwfHOU5KrYEvLW8

Javascript to decode JWT:

function parseJwt (token) {
    // https://stackoverflow.com/questions/38552003/how-to-decode-jwt-token-in-javascript
   var base64Url = token.split('.')[1];
   var base64 = decodeURIComponent(atob(base64Url).split('').map((c)=>{
       return '%' + ('00' + c.charCodeAt(0).toString(16)).slice(-2);
   }).join(''));

   return JSON.parse(base64);
};

Decoding JWTs using Javascript

SOLUTION:

post:juice

Additional Resources

StackOverflow: How to decode jwt token in javascript